<template>
  <div>
    <Row>
      <Col span="21">
        <Row class="row">
          <Col span="8">商户名称：{{settleSummary.merchantName||'无'}}</Col>
          <Col span="8">交易渠道：{{settleSummary.payChannelName||'无'}}</Col>
        </Row>
        <Row class="row">
          <Col span="8">渠道交易清出金额：{{this.getYuan(settleSummary.channelFlowTotalAmount||0)}} 元</Col>
          <Col span="8">渠道退款清出金额：{{this.getYuan(settleSummary.channelRefundTotalAmount||0)}} 元</Col>
          <Col span="8">渠道清出总额：{{this.getYuan(settleSummary.channelClearTotalAmount||0)}} 元</Col>
        </Row>
        <Row class="row">
          <Col span="8">平台交易应清金额：{{this.getYuan(settleSummary.mdFlowTotalAmount||0)}} 元</Col>
          <Col span="8">平台退款应清金额：{{this.getYuan(settleSummary.mdRefundTotalAmount||0)}} 元</Col>
          <Col span="8">平台应清总额：{{this.getYuan(settleSummary.mdClearTotalAmount||0)}}元</Col>
        </Row>
      </Col>
      <Col span="3"><Icon :type="iconStyle.type" size="80" :color="iconStyle.color" /></Col>
    </Row>
  </div>
</template>

<script>
import { Row, Col, Icon } from "view-design";
import util from '@/utils/util';

export default {
  name: "normal_form",
  components: {
    Row,
    Col,
    Icon,
  },
  props: {
    iconStyle: { type: Object },
    settleSummary:{
      merchantCode:String,
      merchantName:String,
      payChannel:String,
      payChannelName:String,
      channelClearTotalAmount:Number,// 渠道清出金额总和（分）
      channelRefundTotalAmount:Number,//渠道退款金额总和（分）
      channelFlowTotalAmount:Number,//渠道交易金额总和（分）

      mdFlowTotalAmount:Number,//中台交易金额总和（分）
      mdRefundTotalAmount:Number,//中台退款金额总和（分）
      mdClearTotalAmount:Number,//中台清出金额总和（分）
    }
  },
  data() {
    return {
    };
  },

  methods: {
    getYuan(amount){
      return util.getYuan(amount||0)
    }
  },
};
</script>

<style scoped>
.row {
  line-height: 40px;
}
</style>